<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title></title>
    <link type="text/css" rel="stylesheet" href="__CSS__/bootstrap.min.css">
    <link type="text/css" rel="stylesheet" href="__CSS__/register.css">
    <link rel="stylesheet" href="__AOS__/css/font-awesome.min.css">
    <script src="__JS__/jquery-1.11.3.js"></script>
    <script src="__JS__/jquery.validate.js"></script>
    <script src="__JS__/messages_zh.js"></script>
    <script src="__JS__/layer/layer.js"></script>
    <script src="__JS__/bootstrap.min.js"></script>
</head>
<body>
<div class="container"style="background-color: black">
    <div class="row"  style="padding: 1rem;">
        <div class="col-xs-12" >
            <a href="{:url('Index/index')}"  style="font-size: 1rem;color:white;">
                <span style="font-size: 1rem" class="glyphicon glyphicon-tint"></span>在线学习
            </a>

        </div>
    </div>
</div>

<div class="container-fluid bk">
    <div class="container">
    <div class="row"><br><br>
        <h1>绑定您的电话号码</h1>
    </div>
    <div class="row container">
            <div class="col-sm-12 text-center row">
                <form class="form-horizontal" role="form" action="{:url('Index/weixin')}" method="post" id="form">
                    <div class="form-group">
                        <label class="col-sm-5 col-xs-4 control-label">手机号码</label>
                        <div class="col-sm-7 col-md-3 col-xs-8">
                            <input type="text" name="mobile" class="form-control phone"  placeholder="请输入您的手机号">
                        </div>
                        <div class="col-md-1 col-xs-12">
                            <span class="ph"></span>
                        </div>
                    </div>
                    <div class="row form-group">
                        <label  class="col-sm-5 control-label  col-xs-4">手机验证码</label>
                        <div class="col-sm-7 col-md-2 col-xs-6">
                            <input type="text" name="yzm" class="form-control" placeholder="请输入您手机验证码">
                        </div>

                        <div class="col-md-1 col-xs-2">
                            <button type="button" class="btn btn-default yzm" title="点击获取手机验证码">点我</button>
                        </div>

                    </div>
                    <div class="form-group">
                        <div class="col-sm-offset-1 col-sm-10">
                            <button type="submit" class="btn btn-default">确认绑定</button>
                        </div>
                    </div>
                </form>
                <br>
                <br><br>

            </div>
        </div>
    </div>
</div>
</body>
</html>

<script>
    a = "{:url('Index/phone')}";
    b = "{:url('Index/register_a')}";

    $(function(){
        $(".phone").focus(function(){
            $(".ph").html("");
        })

        $(".phone").blur(function(){
                var pattern = /^1[34578]\d{9}$/;
                    if(pattern.test( $(".phone").val())){

                        $(".ph").html("输入正确");
                        $(".yzm").click(function(){
                            var setTime;
                            var tim=parseInt(60);
                            setTime=setInterval(function(){
                                if(tim<=0){
                                    clearInterval(setTime);
                                    return;
                                }
                                tim--;
                                $(".yzm").text(tim);
                                $(".yzm").attr("title","60秒以后可以再次获取");
                                if(tim == 0){
                                    $(".yzm").html("点我");
                                    history.go(0);
                                }
                            },1000);

                            if(0<tim<60){
                                $(".yzm").unbind();
                            }

                            $.ajax({
                                type: "post",
                                url: a,
                                dataType: "json",
                                data: {
                                    phone:$(".phone").val()
                                },
                                success:function(msg){
                                    alert("此号码没有注册本网站，请注册");
                                    if(msg == "1"){
                                        window.location.href = b;
                                    }
                                }
                            });
                        })


                    }else{
                        $(".ph").html("输入错误")
                    }
        });





    })
</script>